<template>
  <div>

    <!-- vant导航栏 -->
    <cp-nav-bar right-text="登录" @click-right="$router.push('/login')"></cp-nav-bar>>

    <!-- vant表单 -->
    <van-form style="margin-top: 44px;">
      <van-field v-model="username" name="账号" label="账号" placeholder="手机号"
        :rules="[{ required: true, message: '请填写账号' }, { pattern: /^[1][3,5,6,7,8,9][0-9]{9}$/, message: '请输入正确的11位手机号' }]" />
      <van-field v-model="password" type="password" name="密码" label="密码" placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }, { pattern: /^\w{6,}$/, message: '密码不少于6位' }]" />
      <div style="margin: 16px;">
        <van-button @click="onSubmit" round block type="primary" native-type="submit">
          注册
        </van-button>
      </div>
    </van-form>


  </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router';
import { showSuccessToast, showFailToast } from 'vant';
import { ref } from 'vue';
import { register } from '@/services/user';
const router = useRouter()
const username = ref("")

const password = ref("")


const onSubmit = async () => { //点击注册
  // 如果不符合注册条件则不会继续执行
  if (username.value.trim() == '') {
    return
  }
  if (!username.value.match(/^[1][3,5,6,7,8,9][0-9]{9}$/)) {
    return
  }
  if (!password.value.match(/^\w{6,}$/)) {
    return
  }

  const res = await register({
    "username": username.value,
    "password": password.value,
  })
  if (res.resultNum === 1 as any) {
    showSuccessToast(res.resultMessage)
    router.push({
      path: '/login'
    })
  } else {
    showFailToast(res.resultMessage);
  }




}
</script>

<style lang="scss" scoped></style>

